.container {
    width: 1200px;
    height: 500px;
    min-width: 100%;
    background-color: #f5f5f5;

    .Banner {
        width: 1200px;
        height: 500px;
        margin: 0 auto;
        position: relative;
        display: flex;
        justify-content: center;
        align-items: center;

        .menu {
            position: absolute;
            left: 0;
            z-index: 998;
            top: 0;
            color: white;
            width: 280px;
            height: 485px;
            background-color: rgba(0, 0, 0, 0.4);

            ul {
                width: 100%;
                height: 100%;

                li {
                    width: 100%;
                    height: 11%;

                    &.active {
                        background-color: #27ba9b;
                        transition: all 0.4s linear;
                        -webkit-transition: all 0.4s linear;
                        -moz-transition: all 0.4s linear;
                        -ms-transition: all 0.4s linear;
                        -o-transition: all 0.4s linear;
                    }

                    cursor: pointer;

                    list-style: none;
                    display: flex;
                    justify-content: flex-start;
                    padding-left: 20px;
                    align-items: center;

                    span {
                        margin: 0 7px;

                    }

                    span:first-child {
                        font-size: 18px;
                    }

                    span:last-child {
                        font-size: 14px;
                    }
                }
            }
        }

        .content {
            position: absolute;
            left: 280px;
            z-index: 998;
            top: 0;
            width: 920px;
            height: 485px;
            background-color: rgba(88, 84, 84, 0.2);
            visibility: hidden;

            .title {

                width: 100%;
                height: 10%;
                display: flex;
                align-items: center;
                padding-left: 20px;

                span:first-child {
                    color: #464242;
                    font-size: 20px;

                }

                span:last-child {
                    color: rgb(92, 88, 88);
                    padding-left: 20px;
                }
            }

            .box {
                width: 100%;
                height: 90%;
                display: grid;
                grid-template-columns: 1fr 1fr 1fr;
                grid-template-rows: 1fr 1fr 1fr;

                div {
                    &:hover {
                        background-color: #e3f9f4;
                        cursor: pointer;

                    }

                    background-color: #ffffff;
                    width: 250px;
                    height: 120px;
                    place-self: center;
                    border-radius: 4px;
                    -webkit-border-radius: 4px;
                    -moz-border-radius: 4px;
                    -ms-border-radius: 4px;
                    -o-border-radius: 4px;
                    padding: 10px;
                    display: flex;

                    img {
                        width: 40%;
                    }

                    span {
                        display: block;
                        padding: 5px;
                        overflow: hidden;
                        white-space: nowrap;
                        text-overflow: ellipsis;


                        span {
                            width: 100%;
                            height: 30%;
                            font-size: 15px;
                            color: gray;


                        }

                        span:first-child {
                            height: 30%;
                            color: black;
                            font-size: 17px;

                        }


                        span:last-child {
                            height: 30%;
                            color: rgb(196, 22, 22);
                            font-size: 20px;
                        }


                    }


                }
            }

            &.show {
                visibility: visible;
                transition: all 0.4s linear;
                -webkit-transition: all 0.4s linear;
                -moz-transition: all 0.4s linear;
                -ms-transition: all 0.4s linear;
                -o-transition: all 0.4s linear;
            }
        }

        .Carousel {
            width: 1200px;
            height: 500px;
        }



    }
}